<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>加班审批</title>
</head>
<body>
<script type="text/javascript">
$(function(){
	//初始化表格
	$('#table1').datagrid({
		url:'overtime_selectAll',
		singleSelect:true,
		 frozenColumns: [[
			 	{field:'sortable',title:'#',width:28,align:'center'},
				{field:'Staff_name',title:'姓名',width:80,align:'center'},
				{field:'depart_name',title:'部门',width:80,align:'center'},
			]],
		columns:[[
   	 		{field:'O_ID',hidden:true},
   	 		{field:'O_SHEN',hidden:true},
			{field:'O_DATE',title:'申请时间',width:120,align:'center',
   	 		formatter:function(val,rec){
				return formattime(val);
	        	}	
			},
			{field:'O_KAI',title:'开始时间',width:250,align:'center'
			},
			{field:'O_JIE',title:'结束时间',width:250,align:'center'
				
			},
			{field:'O_TIME',title:'加班时长（/h）',width:100,align:'center'},
			{field:'type',title:'加班类型',width:150,align:'center'},
			{field:'o_sta',title:'审批状态',width:100,align:'center'},
			{field:'O_WHY',title:'申请理由',width:210,align:'center'},
			{field:'caozuo',title:'操作',width:150,align:'center',
				formatter: function(value,row,index){
					if(row['O_SHEN']==0){
						return "<button class='btn3' id='btn-guo' onclick='guo("+row['O_ID']+",1)'>通过</button><button class='btn3' id='btn-guo' onclick='guo("+row['O_ID']+",2)'>驳回</button>";
					}else{
						return "<button class='btn3' id='btn-xiang' onclick='xiang("+row['O_ID']+")'>查看</button>";
					}
				},
			}
   	 	]],	
	    pagination:true,
	    pageNumber:1,
	    pageSize:5,
	    pageList:[5,10,15]
	});
	
});
function xiang(id){
	$("#content-admin").panel({
		href:"kq-overtime-cha?id="+id
	});
}
function guo(id,shen){
	$("#form").form('load','overtime_shen?id='+id+'&&shen='+shen);
	$("#content-admin").panel('open').panel('refresh','kq-overtime-assessor');
}
function formattime(value,row,index){
	var date = new Date(value);
	        var year = date.getFullYear().toString();
	        var month = (date.getMonth() + 1);
	        var day = date.getDate().toString();
	        var hour = date.getHours().toString();
	        var minutes = date.getMinutes().toString();
	        if (month < 10) {
	            month = "0" + month;
	        }
	        if (day < 10) {
	            day = "0" + day;
	        }
	        if (hour < 10) {
	            hour = "0" + hour;
	        }
	        if (minutes < 10) {
	            minutes = "0" + minutes;
	        }
	       
	        return year + "-" + month + "-" + day + " " + hour + ":" + minutes ;
}
</script>
<style type="text/css">
	.index-body1{
		padding: 20px;
    	background-color: #f3f3f3;
    	padding-bottom: 30px;
	}
	.index-body2{
		width: 100%;
	    height: 100%;
	    background-color: #fff;
	}
	.index-body3{
		min-width: 950px;
	     padding: 20px;
	    position: relative;
	}
	.title-left{
		display: inline-block;
	    float: left;
	    line-height:20px;
	    margin-right: 5px;
	    font-size: 12px;
	   	color: gray;
	}
	.title-left span{
		color: #19AA8D;
	    font-size: 14px;
	    font-weight: 700;
	}
	.title-right{
		float: right;
		margin-bottom: 10px;
	}
	.title-right div{
		float: left;
		margin-right: 20px;
	}
	.title-right div input{
		background-color: inherit;
		height: 22px;
	    padding: 0 4px;
	    font-size: 12px;
	    border-radius: 2px;
	    border: 1px solid #eee;
	}
	.title-right-btn{
		padding: 2px 8px 1px 8px;
    	font-size: 12px;
    	border-radius: 3px;
    	color: #666;
    	background-color: #fff;
    	border-color: #e5e6e7;
	}
	.datagrid-header-row td{
		background: #6666661a;
		color: #19AA8D;
	    font-size: 14px;
	    font-weight: 700;
	    text-align: center;
	}
	.datagrid-row td{
		background: #fff;
		font-size: 12px;
		text-align: center;
	}
	ul{
	list-style:none;
	margin: 0px;
	}
	.top-se>li,.date-search{
	float:left;
	padding-right: 5px;
    padding-left: 5px;
	}
	.top-se span{
		font-size: 12px;
		color: gray;
	}
	.btn3{
		margin-right: 10px;
    	border-radius: 4px;
    	cursor: pointer;
    	background-color: #19AA8D!important;
    	color: #fff!important;
    	border-color: #13826b33!important;
    	border: 1px solid transparent;
	}
	h1{
		margin: 0px;
		padding: 0px;
		margin: 0px 20px;
    	float: left;
	}
	.textbox{
		height: 25px;
	}
</style>
<div class="index-body1">
	<div class="index-body2">
			<div class="index-body3">
				<div class="title">
					<div class="title-left"> 
						<h1>加班审批</h1>
					</div>
					<div class="title-right"> 
						<ul class="top-se">
							<li></li>
							<li><span>开始时间</span></li>
							<li><input id="title-right-input1" type="text" class="easyui-datebox" required="required" style="width:150px" placeholder="请选择部门"></li>
							<li><span>至</span></li>
							<li><input id="title-right-input2" type="text" class="easyui-datebox" required="required" style="width:150px" placeholder="请输入员工姓名"></li>
							<li><button class="title-right-btn">搜索</button></li>
						</ul>
				</div>
			</div>
				<div class="body-table">
					<table id="table1" class="easyui-datagrid" data-options="width:1023,height:300">
					</table>
				</div>
			</div>
		</div>
	</div>
	<Form action="" id="form" method="post">
	
	</Form>
</body>
</html>